// pages/car/car.js

Page({

  /**
   * 页面的初始数据
   */
  data: {

    // 商品总价
    total: 0,

    // 是否全部选中
    isAllSelect: false,

    // 滑动 开始时 坐标
    clientX: '',

    // 是否显示 加减 商品 按钮 和删除按钮
    isShowJiajianbtn: false,

    // 滑动时 显示 删除按钮
    isShowDelBtn: '',

    // 有商品 几个 被勾选
    isSelect: 0,

    // 购物车商品
    goodsItem: [
      {
        goods_img: '/images/goods/01.png',
        goods_xinxi: '2017新款菩提瑜伽服上衣性感',
        goods_price: 79,
        goods_xinghao: 'k5012 橘, M',
        goods_num: 1,
        isCheckedCurr: false
      },
      {
        goods_img: '/images/goods/01.png',
        goods_xinxi: '2017新款菩提瑜伽服上衣性感',
        goods_price: 79,
        goods_xinghao: 'k5012 橘, M',
        goods_num: 2,
        isCheckedCurr: false
      },
      {
        goods_img: '/images/goods/01.png',
        goods_xinxi: '2017新款菩提瑜伽服上衣性感',
        goods_price: 79,
        goods_xinghao: 'k5012 橘, M',
        goods_num: 3,
        isCheckedCurr: false
      }
    ]

  },// data end

  // 点击 跳转到 首页
  gotoIndexPage: function () {
      wx.switchTab({
        url: '../index/index',
      })
  },

  // 点击删除
  del: function (e) {
    var that = this;

    // 商品 ID
    var index = e.target.id;

    wx.showModal({
      title: '',
      content: '确定要删除这个商品吗',
      success: function (res) {
        if (res.confirm) {
          // 用户点击确定

          // 删除 指定 商品
          that.data.goodsItem.splice(index, 1);

          // 新数组
          var newArr = that.data.goodsItem;

          // 根据商品 id 删除数组中 指定元素
          that.setData({
            goodsItem: newArr,
            isShowDelBtn: false
          })
          // 删除成功
          wx.showToast({
            title: '删除商品成功',
            icon: 'success',
            duration: 2000
          })
        } else if (res.cancel) {
          // 用户点击取消
          that.setData({
            isShowDelBtn: false
          })
        }
      }
    })

  },

  // 跳转到 商品详情 页面
  showDetailPage: function () {
    wx.navigateTo({
      url: '../../about_index/goods_detail/detail'
    })
  },

  // 滑动 开始 事件
  touchstart: function (e) {

    // 保存开始滑动 坐标
    this.setData({
      clientX: e.changedTouches[0].clientX
    })
  },

  // 滑动 移动 事件
  touchmove: function (e) {

    // 获取当前 滑动的id
    var currentID = e.currentTarget.dataset.index

    // 获取滑动 距离
    var distanceX = e.changedTouches[0].clientX - this.data.clientX;

    if (distanceX > 30) {//右滑

      this.setData({
        isShowDelBtn: -1,
      })
    } else if (distanceX < -30) {

      this.setData({
        // 滑动时 显示 删除按钮
        isShowDelBtn: currentID,
      })
    }


  },

  // 点击全选按钮
  isSelected: function () {

    // 改变 是否有 选中的商品的值
    this.setData({
      isSelect: this.data.goodsItem.length
    })

    // 检测全选按钮的 状态
    if (!this.data.isAllSelect) {
      // 便利数组中的每项
      this.data.goodsItem.forEach(function (ele, index) {
        ele.isCheckedCurr = true;
      });

      var newArr = this.data.goodsItem;

      this.setData({
        isAllSelect: !(this.data.isAllSelect),
        goodsItem: newArr
      })
    } else {
      // 便利数组中的每项
      this.data.goodsItem.forEach(function (ele, index) {
        ele.isCheckedCurr = false;
      });

      var newArr = this.data.goodsItem;

      this.setData({
        isAllSelect: !(this.data.isAllSelect),
        goodsItem: newArr,
        isSelect: 0
      })
    }

    // 遍历 数组 获取 商品总价
    if (this.data.isAllSelect) {
      var total = 0;
      this.data.goodsItem.forEach(function (ele, i) {
        total += ele.goods_price * ele.goods_num;
      })

      this.setData({
        total: total
      })
    } else {
      this.setData({
        total: 0.00
      })
    }
  },

  // 点击编辑按钮
  edit: function () {

    // 是否显示 加减 商品 按钮 和删除按钮
    this.setData({
      isShowJiajianbtn: !this.data.isShowJiajianbtn
    })
  },

  // 点击减少 商品数量
  minusNum: function (e) {

    var currentID = e.currentTarget.dataset.goods_id;

    // 获取 数组 中的属性（需要设置的属性）
    var param = 'goodsItem[' + currentID + '].goods_num';

    this.setData({
      [param]: this.data.goodsItem[currentID].goods_num - 1
    })

  },
  // 点击增加 商品数量
  addNum: function (e) {

    var currentID = e.currentTarget.dataset.goods_id;
    // 获取 数组 中的属性（需要设置的属性）
    var param = 'goodsItem[' + currentID + '].goods_num';

    this.setData({
      [param]: this.data.goodsItem[currentID].goods_num + 1
    })

  },

  // 点击 删除 多个商品
  delSomeGoods: function () {

    // 便利数组 获取选中商品的 个数
    var num = 0;
    this.data.goodsItem.forEach(function (ele, i) {
      if (ele.isCheckedCurr) {
        num++;
      }
    });

    var that = this;

    // 提示是否删除
    wx.showModal({
      title: '',
      content: '确认将这' + num + '个商品删除吗？',
      success: function (res) {

        if (res.confirm) {

          // 删除数组中 isCheckedCurr 为 true 的元素
          // 新数组
          var newArr = that.data.goodsItem;

          for (var i = newArr.length - 1; i > -1; i--) {
            if (newArr[i].isCheckedCurr) {
              newArr.splice(i, 1)
            }
          }

          console.log(newArr);

          that.setData({
            goodsItem: newArr
          })

          // 删除成功
          wx.showToast({
            title: '删除商品成功',
            icon: 'success',
            duration: 2000
          })
        }
      }
    })

    // 判断数组长度是否为0
    if (this.data.goodsItem.length) {
      this.setData({
        isAllSelect: false
      })
    }

  },

  // 是否 选中当前商品----------------------
  isCurrChecked: function (e) {
    // 当前商品id
    var index = e.target.dataset.index;

    // 判断 当前 商品的选中状态
    var isChecked = this.data.goodsItem[index].isCheckedCurr;
    if (!isChecked) {
      // 改变数组中 指定元素
      var item = 'goodsItem[' + index + '].isCheckedCurr'
      this.setData({
        [item]: true,
        isSelect: this.data.isSelect + 1
      })

      // 遍历 数组 获取 商品总价
      var total = 0;
      this.data.goodsItem.forEach(function (ele, i) {
        if (ele.isCheckedCurr) {
          total += ele.goods_price * ele.goods_num;
        }
      })
      this.setData({
        total: total
      })
    } else {
      // 改变数组中 指定元素
      var item = 'goodsItem[' + index + '].isCheckedCurr'
      this.setData({
        [item]: false,
        isSelect: this.data.isSelect - 1
      })

      // 遍历 数组 获取 商品总价
      var total = 0;
      this.data.goodsItem.forEach(function (ele, i) {
        if (ele.isCheckedCurr) {
          total += ele.goods_price * ele.goods_num;
        }
      })
      this.setData({
        total: total,
      })

    }

    // 遍历数组 获取选中商品的 个数
    var num = 0;
    this.data.goodsItem.forEach(function (ele, val) {
      if (ele.isCheckedCurr) {
        num++;
      }
    });

    // 判断商品的 选中项 个数 是否为 数组的长度
    if (num === this.data.goodsItem.length) {
      this.setData({
        isAllSelect: true
      })
    } else {
      this.setData({
        isAllSelect: false
      })
    }

  },

  // 跳转到 结算页面
  gotoClearingPage: function () {

    console.log(this.data.isSelect)

    wx.navigateTo({
      url: '../../about_car/Clearing/Clearing',
    })

  },

  /**
   * 生命周期函数--监听页面加载-------------
   */
  onLoad: function (options) {

    
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    wx.stopPullDownRefresh()
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})